<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>函电</title>
    <link rel="stylesheet" href="/home/static/layui/css/layui.css">
    <script src="/home/static/layui/layui.js"></script>
    <link rel="stylesheet" href="/home/css/letter.css">
    <link rel="stylesheet" href="/home/css/base.css">
    <script src="/home/static/jquery-3.2.1.min.js"></script>
</head>
<body>
<header>
    <p>
        <span>商务英语、国际贸易系列教学软件，涵盖了教学资源、教学课程、考试和专业实习。 产品贯穿教学的整个过程，能够辅助老师教学，训练与考察学生的各个技能点，对提高学生的实践能力起到促进作用，帮助学生更快更好地适应工作岗位。</span></p>
    <a href="/" class="logo">Home</a>
</header>
<main class="layui-main" id="app">
    <h3>函电</h3>
    @foreach($data as $value)
    <div class="item">
        <div class="row1">
            <h4>{{$value['letter_name']}}</h4>
            <span>收件人{{$value['geter']}}</span>
            <span>发件人{{$value['sender']}}</span>
        </div>
        <div class="content hidden">
            <pre>

            {{$value['content']}}
            </pre>
        </div>
        <a href="javascript:;" class="toggle layui-btn layui-btn-sm layui-btn-primary">显示全文</a>

    </div>
    @endforeach
</main>
<script>
//$('.content').click(function(){
//    this.classList.toggle('hidden');
//    if($(this).hasClass('hidden')){
//        $(this).siblings('.toggle')[0].innerText = '显示全文';
//    }else{
//        $(this).siblings('.toggle')[0].innerText = '收起全文';
//    }
//})
$('.toggle').click(function(){
    if(this.innerHTML == '显示全文'){
        this.innerText = '收起全文';
    }else{
        this.innerText = '显示全文';
    }
    $(this).siblings('.content')[0].classList.toggle('hidden')
})
</script>
</body>
</html>